<template>
  <panel :title="data.title">
    <el-form
      ref="form"
      :model="data.addForm"
      label-width="60px"
      class="add-form"
    >
      <el-form-item :label="data.firstInpText">
        <el-input v-model="data.addForm.account"></el-input>
      </el-form-item>

      <el-form-item :label="data.secondInpText">
        <el-input v-model="data.addForm.password"></el-input>
      </el-form-item>

      <el-form-item :label="data.thirdInpText">
        <el-select
          v-model="data.addForm.userGroup"
          placeholder="请选择用户组"
          v-if="data.thirdInpText === '用户组'"
        >
          <el-option value="超级管理员"></el-option>
          <el-option value="普通管理员"></el-option>
        </el-select>

        <el-input
          v-model="data.addForm.againPwd"
          v-else
        ></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary">{{ data.btnValue.first }}</el-button>
        <el-button>{{ data.btnValue.second }}</el-button>
      </el-form-item>
    </el-form>
  </panel>
</template>

<script>
import Panel from "@/components/panel/Panel.vue";
export default {
  components: {
    Panel,
  },
  props: {
    data: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
};
</script>

<style lang="less" scoped>
.add-form {
  /deep/ .el-input__inner {
    width: 200px;
  }
}
</style>